import React, { useState } from 'react';
import { Routes, Route } from 'react-router-dom';
import Header from './components/layout/Header';
import Footer from './components/layout/Footer';
import Home from './pages/Home';
import Login from './pages/Login';
import Register from './pages/Register';
import Dashboard from './pages/Dashboard';
import ResumeEditor from './pages/ResumeEditor';
import ResumePreview from './pages/ResumePreview';
import ResumeShare from './pages/ResumeShare';
import TemplateGallery from './pages/TemplateGallery';
import NotFound from './pages/NotFound';
import { AuthProvider } from './contexts/AuthContext';
import PrivateRoute from './components/auth/PrivateRoute';

function App() {
    return (
        <AuthProvider>
            <div className="app">
                <Header />
                <main className="main-content">
                    <Routes>
                        <Route path="/" element={<Home />} />
                        <Route path="/login" element={<Login />} />
                        <Route path="/register" element={<Register />} />
                        <Route path="/templates" element={<TemplateGallery />} />
                        <Route path="/resume/:id" element={<ResumePreview />} />
                        <Route path="/share/:id" element={<ResumeShare />} />

                        {/* Protected Routes */}
                        <Route path="/dashboard" element={
                            <PrivateRoute>
                                <Dashboard />
                            </PrivateRoute>
                        } />
                        <Route path="/editor/:id" element={
                            <PrivateRoute>
                                <ResumeEditor />
                            </PrivateRoute>
                        } />
                        <Route path="/editor/new" element={
                            <PrivateRoute>
                                <ResumeEditor />
                            </PrivateRoute>
                        } />

                        {/* 404 Route */}
                        <Route path="*" element={<NotFound />} />
                    </Routes>
                </main>
                <Footer />
            </div>
        </AuthProvider>
    );
}

export default App; 